<template>
    <div>
        <el-scrollbar height="600px">
            <el-table ref="table" :data="store.state.questionBank.subjectModel.testPaperTableData" style="width: 100%" empty-text="好像没有数据哎😔" height="600px" v-loading.fullscreen.lock="loadingShow"
                :scrollbar-always-on="true" element-loading-text="数据加载中..." @select="select" @select-all="selectAll">
                <el-table-column type="selection"></el-table-column>
                <el-table-column type="index"></el-table-column>
                <el-table-column prop="testPaperId" label="id" width="100" />
                <el-table-column prop="testPaperName" label="试卷标题" />
                <el-table-column prop="testPaperTimeNumber" label="考试时长" width="100" align="center"/>
                <el-table-column prop="testPaperFraction" label="试卷总分" width="100" align="center"/>
                <el-table-column prop="testPaperDifficulty" label="试卷难度" width="100" align="center"/>
                <el-table-column label="发布状态" width="100" align="center">
                    <template #default="scope">
                        <el-tag class="ml-2" type="success" v-if="scope.row.status == 1">已发布</el-tag>
                        <el-tag class="ml-2" type="info" v-if="scope.row.status == 2">未发布</el-tag>
                    </template>
                </el-table-column>
                <el-table-column fixed="right" label="操作" width="120">
                    <template #default="scope">
                        <el-space wrap>
                            <MyTestPaperReadingComponent :data="scope.row"></MyTestPaperReadingComponent>
                        </el-space>  
                    </template>
                </el-table-column>
            </el-table>
        </el-scrollbar>


        <el-pagination v-model:currentPage="store.state.questionBank.subjectModel.testPaperPagination.pageNum"
            v-model:page-size="store.state.questionBank.subjectModel.testPaperPagination.pageSize"
            :page-sizes="[10, 20, 50, 100]" layout=" prev, pager, next, jumper,sizes,total"
            :total="store.state.questionBank.subjectModel.testPaperPagination.total" @size-change="handleSizeChange"
            @current-change="handleCurrentChange" />
    </div>
</template>

<script>
import { useStore } from 'vuex'
import axios from 'axios';
import { onMounted, ref, watch } from '@vue/runtime-core';
import { ElLoading } from 'element-plus'
import { table } from 'console';
import MyTestPaperReadingComponent from './MyTestPaperReadingComponent.vue';
export default {
    setup() {
        const store = new useStore();
        let loadingShow = ref(false); //加载层
        //页码大小改变
        function handleSizeChange(a) {
            let data = {
                total: store.state.questionBank.subjectModel.testPaperPagination.total,
                pageNum: 1,
                pageSize: store.state.questionBank.subjectModel.testPaperPagination.pageSize,
                accountTypeId: store.state.questionBank.subjectModel.testPaperPagination.accountTypeId,
                testPaperTypeId: store.state.questionBank.subjectModel.testPaperPagination.testPaperTypeId,
                status: store.state.questionBank.subjectModel.testPaperPagination.status,
                testPaperTypeList: store.state.questionBank.subjectModel.testPaperTypeList
            };
            axios.get("/api/testPaper/selectPageTestPaper", {
                params: {
                    testPaperTypeId: store.state.questionBank.subjectModel.testPaperPagination.testPaperTypeId,
                    accountTypeId: store.state.questionBank.subjectModel.testPaperPagination.accountTypeId,
                    status: store.state.questionBank.subjectModel.testPaperPagination.status,
                    pageNumber: store.state.questionBank.subjectModel.testPaperPagination.pageNum,
                    pageSize: store.state.questionBank.subjectModel.testPaperPagination.pageSize
                }
            }).then((response) => {
                if (response.status == 200) {
                    if (response.data.code == 200) {
                        data.total = response.data.data.total;
                        store.commit("setTestPaperPagination", data);
                        store.commit("setTestPaperTableData", response.data.data.list);
                    }
                }
            });
        }
        //页码改变
        function handleCurrentChange(a) {
            let data = {
                total: store.state.questionBank.subjectModel.testPaperPagination.total,
                pageNum: store.state.questionBank.subjectModel.testPaperPagination.pageNum,
                pageSize: store.state.questionBank.subjectModel.testPaperPagination.pageSize,
                accountTypeId: store.state.questionBank.subjectModel.testPaperPagination.accountTypeId,
                testPaperTypeId: store.state.questionBank.subjectModel.testPaperPagination.testPaperTypeId,
                status: store.state.questionBank.subjectModel.testPaperPagination.status,
                testPaperTypeList: store.state.questionBank.subjectModel.testPaperTypeList
            };
            axios.get("/api/testPaper/selectPageTestPaper", {
                params: {
                    testPaperTypeId: store.state.questionBank.subjectModel.testPaperPagination.testPaperTypeId,
                    accountTypeId: store.state.questionBank.subjectModel.testPaperPagination.accountTypeId,
                    status: store.state.questionBank.subjectModel.testPaperPagination.status,
                    pageNumber: store.state.questionBank.subjectModel.testPaperPagination.pageNum,
                    pageSize: store.state.questionBank.subjectModel.testPaperPagination.pageSize
                }
            }).then((response) => {
                if (response.status == 200) {
                    if (response.data.code == 200) {
                        data.total = response.data.data.total;
                        store.commit("setTestPaperPagination", data);
                        store.commit("setTestPaperTableData", response.data.data.list);
                    }
                }
            });
        }
        let userSelectTestPaper = ref([])
        function select(a){

          userSelectTestPaper.value = a
          store.commit("setuserSelectTestPaper",userSelectTestPaper.value)
        }
        function selectAll(a){

          userSelectTestPaper.value = a
          store.commit("setuserSelectTestPaper",userSelectTestPaper.value)
        }
        return {
            loadingShow,
            store,
            handleSizeChange,
            handleCurrentChange,
          select,
          selectAll,
          userSelectTestPaper
        };
    },
    components: { MyTestPaperReadingComponent }
}
</script>

<style>

</style>